<template>
  <div v-if="islogin">
    <el-dropdown @command="handleCommand">
      <span class="el-dropdown-link" :style="{ color: color ? color : '#000' }">
        {{ username }}<i class="el-icon-arrow-down el-icon--right"></i>
      </span>
      <el-dropdown-menu slot="dropdown">
        <el-dropdown-item command="recharge">用户充值</el-dropdown-item>
        <el-dropdown-item command="rechargeRecored">充值记录</el-dropdown-item>
        <el-dropdown-item command="changeUser">基本信息</el-dropdown-item>
        <el-dropdown-item v-if="roleType == '5'" command="control"
          ><router-link to="/manage/userList" style="color: grey"
            >控制台</router-link
          ></el-dropdown-item
        >
        <el-dropdown-item command="exit">退出</el-dropdown-item>
      </el-dropdown-menu>
    </el-dropdown>
  </div>
  <div v-else>
    <router-link to="/login/first" style="color: #fff">登录</router-link>
    &nbsp;|&nbsp;
    <router-link to="/register/second" style="color: #fff">注册</router-link>
  </div>
</template>
<script>
import { setUser, getUser, removeUser } from "@/utils/auth";
export default {
  name: "mynav",
  props: ["color"],
  data() {
    return {
      username: "",
      roleType: "",
      islogin: false,
    };
  },
  mounted() {
    this.getUerInfo();
  },
  methods: {
    getUerInfo() {
      let obj = getUser() ? JSON.parse(getUser()) : {};
      if (obj.hasOwnProperty("username")) {
        this.username = obj.username;
        this.roleType = obj.type;
        this.islogin = true;
      } else {
        this.islogin = false;
      }
    },
    handleCommand(args) {
      console.log(args);
      switch (args) {
        case "recharge":
           this.$router.push("/frontmsg/recharge");
          //  location.href='/frontmsg/recharge'
          break;
        case "rechargeRecored":
           this.$router.push("/frontmsg/rechargerecored");
            // location.href='/frontmsg/rechargerecored'
          break;
        case "changeUser":
           this.$router.push("/frontmsg/changuser");
            // location.href='/frontmsg/changuser'
          break;
        case "control":
          this.$router.push("/manage/userList");
          break;
        case "exit":
          this.$store.dispatch("user/logout", this.ruleForm).then(
            (resp) => {
              if (resp.status == 200) {
                removeUser(); //移除本地信息
                this.$message({
                  type: "success",
                  message: "退出成功",
                });
                if (this.$router.currentRoute.path == "/") this.getUerInfo();
                else this.$router.push("/");
              }
            },
            (res) => {}
          );
          break;
        default:
          break;
      }
    },
  },
};
</script>
<style lang="less" scoped>
</style>
